<template>
  <orh-table reload  @on-reload="refresh"  pages :pageDate="pageDate" @on-page-change="queryData">
    <semester-change @on-select="peoplebutton" slot="option" style="width: 230px;" ></semester-change>
    <Table
      :data="datalist"
      :columns="columns1"
      slot="table" :loading="tableload"></Table>
  </orh-table>
</template>

<script>

  export default {
    props: {
        userid: {
            type: [Boolean,Number],
            default: false
        }
    },
    components: {
 	    SemesterChange: resolve=> require(['&/Authpub/semesterchange.vue'],resolve)
    },
    data () {
		return {
			datalist:[],
			tableload: false,
			titles:null,
			pageDate:{
				total:0,
				current_page:1,
				per_page:10
			},
            // 列表接口请求携带参数
            condition:{
                semester_id:null,
                user_id:this.userid,
            },
			listUrl:null,
			columns1:  [
				{
					title: '部门',
					render: (h, params) => {
						let name = params.row.department_name!='' ? params.row.department_name.department_name.zh : ''                            
						return h('div',name);
					}
				},
				{
					title: '教师姓名',
					render: (h, params) => {
						let teacher_name = params.row.user_teacher!='' ? params.row.user_teacher[0].teacher_name.zh : ''                            
						return h('div',teacher_name);
					}
				},
				{
					title: '编码',
					key: 'card_code',
				},
				{
					title: '时间',
					key: 'auth_time',
					
				},
				{
					title: '设备位置',
					key: 'device_ip',
				},
				{
					title: '类型',
					render: (h, params) => {
					let name = params.row.alert==1 ? '正常' : (params.row.alert==2 ? '迟到' : (params.row.alert==3 ? '早退' : (params.row.alert==4 ? '旷工' : '未知')))
					let colorstr=params.row.alert==1 ? 'green' : (params.row.alert==2 ? 'red' : (params.row.alert==3 ? 'red' : (params.row.alert==4 ? 'red' : '')))
					return h('span',{style: {color: colorstr,},},name)
					}	
				},
			],
		}
    },
    methods: {
		
        /************************************************************
         * 
         * 点击学年学期
         * 
         ************************************************************/
		peoplebutton(val){
			this.condition.semester_id=val
			this.listUrl='api/teacher/v1/get/teacher/attendancedatalist?page='
			this.queryData()
		},

        /************************************************************
         * 
         * 请求列表数据
         * 
         ************************************************************/
		queryData(index=1) {
			this.tableload=true
			this.$http.get(`${this.listUrl}${index}`,{params:this.condition}).then(val=>{			
				this.datalist=val.data;
                if(val.pages){
                    this.pageDate.total=val.pages.total
                    this.pageDate.per_page=val.pages.per_page
                    this.pageDate.current_page=val.pages.current_page
                }
				this.tableload=false
			}).catch(err => {
                if(err.code && err.code==422) {
                    this.$Message.error(err.message);
                }
                this.tableload = false;
			})
		},

        /************************************************************
         * 
         * 刷新
         * 
         ************************************************************/
		refresh(){
			this.queryData(this.pageDate.current_page)
		},
	},
	mounted(){
		this.listUrl='api/teacher/v1/get/teacher/attendancedatalist?page='
		this.queryData()
	}
}
</script>




